<template>
  <section>
    <Form
      v-show="isSuccess"
      :institution="institution"
      @success="success"
      @succeeded="succeeded"
      @failed="failed"
      @prevStep="$emit('prevStep')"
    />
    <RequestStatus
      v-if="!isSuccess"
      :request-status="requestStatus"
      @reauthorization="reauthorization"
    />
  </section>
</template>

<script>
import Form from './Form.vue';
import RequestStatus from './RequestStatus.vue';

export default {
  components: {
    Form,
    RequestStatus
  },

  props: {
    institution: {
      type: String,
      default: () => ''
    }
  },

  data() {
    return {
      isSuccess: true,
      requestStatus: true
    };
  },

  methods: {
    reauthorization() {
      this.requestStatus = true;
      this.isSuccess = true;
    },

    success() {
      this.isSuccess = false;

      console.log('dadadadada');
    },

    succeeded() {
      this.requestStatus = true;

      this.$emit('nextStep');
    },

    failed() {
      setTimeout(() => {
        this.requestStatus = false;
      }, 1000);
    }
  }
};
</script>
